import React from 'react';
import {connect} from 'react-redux'
import banner01 from '../../../static/img/banner01.png';
import banner02 from '../../../static/img/banner02.png';
import banner03 from '../../../static/img/banner03.png';
import banner04 from '../../../static/img/banner04.png';
import banner05 from '../../../static/img/banner05.png';

class Channel extends React.PureComponent {
   render(props){
      return (
         <div className="channel">
            {/* {
               this.props.list.map((item)=>{
                  return (
                     <a className="link" key={item.get("id")} href={item.get("link")}>
                        <img alt="" src={item.get("imgUrl")} />
                     </a>
                  )
               })
            } */}
          <a className="link" href="https://www.jianshu.com/trending/weekly?utm_medium=index-banner-s&utm_source=desktop">
            <img alt="" src={banner01} />
          </a>

            <a className="link" href="https://www.jianshu.com/trending/monthly?utm_medium=index-banner-s&utm_source=desktop">
            <img alt="" src={banner02} />
          </a>

            <a className="link" href="https://www.jianshu.com/mobile/books?category_id=284">
            <img alt="" src={banner03} />
          </a>

            <a className="link" href="https://www.jianshu.com/publications">
            <img alt="" src={banner04} />
          </a>

            <a className="link" href="https://www.jianshu.com/c/e048f1a72e3d?utm_medium=index-banner-s&utm_source=desktop">
            <img alt="" src={banner05} />
          </a>
         </div>
      )
   }
}

const mapStateToProps = (state)=>{
   return {
      list: state.getIn(["home", "channelList"])
   }
}

export default connect(mapStateToProps, null)(Channel)